<template>
  <div class="product">
    <h3 style="color: red; float: left; margin-left: 30px">热销商品茶叶</h3>
    <el-table
      v-if="flag"
      :data="teaData"
      @row-click="handleRow"
      stripe
      style="width: 100%"
    >
      <el-table-column prop="index" label="序号" width="120"> </el-table-column>

      <el-table-column prop="imgPath" label="图片" width="150">
        <template slot-scope="scope">
          <img
            :src="require('/src/assets/img/' + scope.row.imgPath)"
            width="50"
            height="50"
          />
        </template>
      </el-table-column>

      <el-table-column prop="name" label="产品名称" width="150">
      </el-table-column>

      <el-table-column prop="brand" label="品牌" width="120"> </el-table-column>

      <el-table-column prop="price" label="价格" width="120"> </el-table-column>

      <el-table-column prop="username" label="商家" width="120">
      </el-table-column>

      <el-table-column prop="" label="相关操作" width="150">
        <template slot-scope="scope">
          <el-button
            type="success"
            icon="el-icon-circle-plus-outline"
            :disabled="scope.row.store == 0"
            @click="addIntoCar"
            >添加购物车</el-button
          >
        </template>
      </el-table-column>
    </el-table>
  </div>
</template>

<script>
import { getRequest } from "../../util/request";
export default {
  name: "SearchProduct",
  data() {
    return {
      tableObj: {
        tableData: [],
        number: 2,
        totalPages: 0,
        currentPage: 1,
        temporary: [],
      },
      teaData: [],
      rowData: "",
      flag: false,
      loading: false,
    };
  },
  methods: {
    //添加购物车
    addIntoCar() {
      console.log(this.rowData);
      this.timer = setTimeout(() => {
        if (this.rowData.id == this.$cookie.get("userId")) {
          this.$message({
            showClose: true,
            message: "您不能购买自己的商品哟！",
            type: "error",
          });
        } else {
          this.$bus.$emit("teaData", this.rowData);
          this.$message({
            showClose: true,
            message: "已添加至购物车",
            type: "success",
          });
        }

        // console.log("this.rowData", this.rowData);
      }, 0);
    },

    //处理当行数据
    handleRow(row) {
      //   console.log(row)
      if (this.rowData !== "") {
        this.rowData = "";
      }
      this.rowData = row;
    },

    //获取查询结果数据
    hotSale() {
      let requestResult = getRequest("user/selHotProduct", "");
      requestResult.then(
        (response) => {
          // console.log("response", response);
          this.teaData = response.data;
          this.flag = true;
        },
        (error) => {
          throw error;
        }
      );
    },
  },
  mounted() {
    this.hotSale();
    this.$bus.$on("searchResult", (result) => {
      //   console.log("SearchProduct.vue:", result);
      if (result.length) {
        this.teaData = result;
      } else {
        this.hotSale();
      }
    });
  },
};
</script>

<style scoped lang='less'>
.product {
  width: 99%;
  min-height: 200px;
  //   background-color: #ddd;
  margin: 10px;
  margin-right: 20px;
}
</style>